<template>
  <div class="personal_purse">
    <my-header :showBack="true"  :title="$t('lang.RegisterPoint')"    @rightAction="pushPath('/RegistrationList')"  :rightText="$t('lang.Bill')" ></my-header>
    <div>
      <div class="topred_bg">
				<h2>{{JifenNum||"0.00"}}</h2>
				<p>{{$t("lang.Curraregistrypoints")}}</p>
			</div>
      <div class="setbi_box">
          <div class="ul_bibox">
            <div class="useabble">
              <div class="coinbot">
                <p>{{$t("lang.Intoaccount")}}</p>
                <div class="tflex">
                  <input type="text" v-model="hqPhone"  class="coinnum"  :placeholder="$t('lang.intotheaccount')">
                </div>
              </div>
              <div class="coinbot">
                <p>{{$t("lang.Intoanumber")}}</p>
                <div class="tflex">
                  <input type="number" v-model="coinOutNum"  class="coinnum" :placeholder="$t('lang.Intoanumber')">
                </div>
              </div>
              <div class="coinbot">
                <p>{{$t("lang.scccPword")}}</p>
                <input type="password" v-model="outpayWord" class="coinnum" :placeholder="$t('lang.enterSpword')">
              </div>
              <div class="actsetbox">
                <p>{{setLectName}}</p>
              </div>
            </div>
          </div>  
        </div>
        <div class="sure_btn">
          <van-button type="primary" size="large"  @click="RegistrationBtn">{{$t("lang.Immediatetransformation")}}</van-button>
        </div>
    </div>
  </div>
</template> 

<script>
import header from "@/components/header";
import { Toast } from 'vant';
import ClipboardJS from 'Clipboard'

export default {
  components: {
    "my-header": header
  }, 
  inject:['reload'],
  data(){
    return{
			userInfo:{},
      coinOutNum:"0.00",
      outpayWord:"",
      hqPhone:"",
      JifenNum:"",
      setLectName:"",
    }
  },
  filters: {
    formatDate(time) {
      var date = new Date(time);
      return timeFormat.formatDate(date, "yyyy.MM.dd hh:mm");
    }
  },
  watch:{
    hqPhone(){
      // 查询用户名
      if(!this.hqPhone){
        console.log(this.hqPhone);
        
        // Toast({ message: "请输入正确的手机号码", position: "bottom"});
        return;
      }
      this.selectInfoByAccount();
    }
  },
  mounted(){
    this.$store.commit("updateSelected", 2);
    this.$store.commit("updateNeedShowFooter", true);
    this.selectAccount();
  },
  methods:{
    // POST /api/coin/directTrade
    RegistrationBtn(){
      // if (!this.$validator.isPhone(this.hqPhone)) {
      //   Toast({ message: "请输入正确的账号", position: "bottom" });
      //   return;
      // }
      if (!this.$validator.isInt(this.coinOutNum)) {
        Toast({ message: this.$t('lang.EnterTrueNum'), position: "bottom" });
        return;
      } 
      if(!this.$validator.isPassword(this.outpayWord)){
        Toast({message: this.$t('lang.enterSpword'),position: "bottom"});
        return;
      }
      this.$ajax(this.$api.directTrade,{type:2,customerNumber:this.hqPhone,amount:this.coinOutNum,payPass:this.outpayWord}).then(res => {
        if (res.code === 0 && res.msg) {
          Toast({ message: this.$t('lang.CZsuccessful'), position: "bottom" });
          this.hqPhone="";
          this.coinOutNum="";
          this.outpayWord="";
          setTimeout(()=>{
            // this.reload();
            // this.RegistrationBtn()
            this.selectAccount()
          },1000)
        }else{
          Toast({ message: res.msg, position: "bottom" });
        }
      });
    },
        selectAccount(){
      // 个人资产
      this.$ajax(this.$api.selectAccount).then(
        res=>{
          if(res.code==0){
            this.MyAsset=res.msg;
            const UseStock = res.msg.useStock;
            const DeliveryStock = res.msg.deliveryStock;
            const FixedStock = res.msg.fixedStock;
            const DynamicMoney = res.msg.dynamicMoney;
            const StaticMoney = res.msg.staticMoney;
            const ActivationPoint = res.msg.activationPoint;
            const UsePoint = res.msg.usePoint;
            const RegisterPoint = res.msg.registerPoint;
            const UseBonus = res.msg.useBonus;
            
            var listArr=new Array();
            listArr =[{Name:'可用股权',num:UseStock},{Name:'配送股权',num:DeliveryStock},{Name:'定期股权',num:FixedStock},
        {Name:'动态配套',num:DynamicMoney},{Name:'静态配套',num:StaticMoney},{Name:'激活分',num:ActivationPoint},
        {Name:'流通分',num:UsePoint},{Name:'注册分',num:RegisterPoint},{Name:'奖金',num:UseBonus},]
            console.log(res.msg);
            console.log(listArr);
            // 注册分
            this.JifenNum=res.msg.registerPoint.toFixed(3);
          }
        }
      )
    },
    selectInfoByAccount(){
       //查询用户信息
      this.$ajax(this.$api.selectInfoByAccount,{id:this.hqPhone}).then(
        res=>{
          console.log(res.code);
          
          if (res.code === 0 && res.msg){
            // Toast({ message: "查询成功", position: "bottom"});
              if(res.msg.trueName==undefined){
                this.setLectName="未在平台注册";
              }else if(res.msg.trueName==""){
                this.setLectName="未实名认证";
              }else{
                this.setLectName="姓名为:"+res.msg.trueName;
              } 
          }else{
              this.setLectName="提示：此账号未在平台注册或输入错误";
            }
        }
      )
    },
  }
}
</script>

<style lang='less' scoped>
.topred_bg{
	color: #ffffff;
	background:linear-gradient(150deg,rgba(172,6,0,1) 0%,rgba(135,2,0,1) 100%);
	border-radius:2px;
  box-sizing: border-box;
  padding: 15px 0 26px 12px;
  margin:10px 12px;
  h2{color: #E1AF56;font-size: 30px;}
  p{color: #AA7A24;font-size: 14px;}
}
.tflex{display: flex;align-items:center ;}
.useabble{
  box-sizing: border-box;padding:0 12px;
  input{width: 100%;border:none;height: 30px;}
  .coinnum{font-size: 16px;background: #ffffff;}
  .coinbot{
    border-bottom: 1px solid #eeeeee;padding: 15px 0 12px 0;
    p{padding-bottom: 5px;color: #333333;font-size: 14px;}
    }
}
</style>
